<template>
  <!--  <h2>专题统稿</h2>-->
  <div class="app-container">
    <el-row :gutter="20">
      <el-col :span="4" :xs="24" ref="hMain">
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button type="primary" plain icon="el-icon-plus" @click="handleClick"
              v-hasPermi="['bianyan:unifiedManuscript:go']">转至成果管理</el-button>
          </el-col>
        </el-row>
        <div class="head-container" :style="{ height: tableHeight + 'px' }" style="overflow: auto">
          <el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false"
            :filter-node-method="filterNode" :default-expanded-keys="expandedkeys" :current-node-key="currentNodekey"
            ref="tree" node-key="typeId" default-expand-all highlight-current @node-click="handleNodeClick"
            :style="isSize">
            <template slot-scope="{ node, data }">
              <span class="span-ellipsis" :title="node.label" :style="isSize">{{ node.label }}</span>
            </template>
          </el-tree>
        </div>
      </el-col>

      <el-col :span="20" :xs="24" v-show="isShow" ref="hMain">
        <div v-show="isShowContent">
          <el-card class="box-card" style="height: 800px">
            <div slot="header" class="clearfix">
              <span :style="isSize">{{ title }}</span>
              <span style="margin-left: 5%" :style="isSize">作者：{{ userName }}</span>
              <span style="margin-left: 5%;" :style="isSize">当前状态：</span> <span :style="isSize" style="color: #C03639;">{{
                state }}</span>
              <el-button style="margin-left: 10%;" plain type="success" v-show="isShowUnified"
                @click="unified">统稿</el-button>
              <el-button style="margin-left: 10%;" plain type="success" v-show="isShowCompletion"
                @click="completion">办结专题</el-button>
            </div>
            <div>
              <el-button plain type="primary" v-show="isShowEditResults" @click="handleEdit">编辑结果</el-button>
              <el-button plain type="primary" v-show="isShowUnifiedDraftResults" @click="handleUnified">统稿结果</el-button>
              <div v-show="isShowEditor" style="margin-top: 1%; overflow-y: auto; max-height: 630px;">
                <editor v-model="keyword" :min-height="630" style="width: 100%" read-only />
              </div>
            </div>
          </el-card>
        </div>
        <div v-show="!isShowContent" class="empty">
          <el-empty :image-size="200" description="无权限查看"></el-empty>
        </div>
      </el-col>

      <el-col :span="20" :xs="24" v-show="!isShow" class="empty">
        <el-empty :image-size="200"></el-empty>
      </el-col>
    </el-row>



    <el-dialog :visible.sync="open" width="23%" append-to-body :before-close="closeDelDialog">
      <el-form class="demo-ruleForm">
        <el-form-item label="密级" prop="region">
          <el-select v-model="fileMj" placeholder="请选择文件密级" style="width:80%;">
            <el-option v-for="(item, idx) in renyuanOptions" :key="idx" :label="item.dictLabel"
              :value="item.dictValue"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer">
        <el-button type="primary" @click="okTap">确 定</el-button>
      </span>
    </el-dialog>






    <!-- 统稿 -->
    <editDetail :detail="detail" @editCancel="editCancel" ref="editThemeRef" :isParams="2"></editDetail>
  </div>
</template>

<script>
import estimateTableHeight from "@/mixins/estimateTableHeight";
import { getTree, updateCode } from "@/api/archive/bianyan/createTopicLibrary";
import { getDetail, transferCode } from "@/api/archive/bianyan/editTheme";
import editDetail from "@/views/archive/bianyan/editTheme/editDetail";
import { getDicts_archive } from '@/api/archive/dict/dictManageData'
import { fbstat } from "@/api/archive/fileCollection/offlinReception.js";
import {
  getdamjbyrymj
} from "@/api/archive/fileCollection/offlinReception.js";
export default {
  mixins: [estimateTableHeight], // 混入方法
  components: { editDetail },
  name: "index",
  data() {
    return {
      deptOptions: undefined,
      //默认展开的树节点
      expandedkeys: [],
      //默认选中的树节点
      currentNodekey: "",
      defaultProps: {
        children: "children",
        label: "typeName"
      },

      isShow: false, //是否显示右侧数据
      isShowContent: false,
      // 节点标题
      title: '',
      // 作者
      userName: '',
      // 当前状态
      state: '',
      // 树节点
      typeId: '',
      // 父id
      parentId: '',

      // 统稿按钮
      isShowUnified: false,
      // 办结专题按钮
      isShowCompletion: false,
      // 编辑结果按钮
      isShowEditResults: false,
      // 统稿结果按钮
      isShowUnifiedDraftResults: false,
      // 是否展示内容
      isShowEditor: false,
      // 编辑参数
      detail: {
        // 是否显示弹出层
        open: false,
        // 弹出层标题
        title: '',
        // 树id
        typeId: ''
      },
      // 内容
      keyword: '',
      info: undefined,
      renyuanOptions: [],//密级下拉列表
      isFbState: false,
      fileMj: undefined,
      open: false
    }
  },
  computed: {

    isSize() {

      if (this.$store.getters.size == 'small') {
        this.size = 'font-size: 12px;'
      } else {
        this.size = 'font-size: 14px;'
      }
      return this.size
    }


  },
  created() {
    this.getDeptTree()
    fbstat().then(res => {  //false=不是分保，true=是分保 
      this.isFbState = res.data
      if (this.isFbState) {
        //密级下拉列表
        getDicts_archive("MJ").then(res => { //人员密级
          getdamjbyrymj().then(resdata => { //此接口没有返回dictLabel，需要组装接口
            var mjdata = [];
            for (var i in resdata.data) {
              for (var j in res.data) {
                if (resdata.data[i].daMj == res.data[j].dictValue) {
                  mjdata.push(res.data[j])
                }
              }
            }

            this.renyuanOptions = mjdata
          })
        })
      }
    })
  },
  methods: {
    closeDelDialog() {
      this.open = false,
        this.fileMj = this.undefined;
    },
    /** 查询部门下拉树结构 */
    getDeptTree(item) {
      if (item == undefined) {
        getTree().then(response => {
          this.deptOptions = response.data
          if (this.deptOptions.length > 0) {
            this.currentNodeKey = this.deptOptions[0].typeId;
            this.expandedkeys.push(this.deptOptions[0].typeId);
            this.$nextTick(() => {
              this.$refs.tree.setCurrentKey(this.deptOptions[0].typeId)
            })
          }
        })
      } else {
        getTree().then(response => {
          this.deptOptions = response.data
          if (this.deptOptions.length > 0) {
            this.currentNodeKey = this.typeId;
            this.expandedkeys.push(this.typeId);
            this.$nextTick(() => {
              this.$refs.tree.setCurrentKey(this.typeId)
            })
            const data = this.findMatchingNode(this.deptOptions, this.typeId)
            this.handleNodeClick(data)
            this.getMaterialDetail()
          }
        })
      }
    },
    findMatchingNode(tree, typeId) {
      for (const node of tree) {
        if (node.typeId === typeId) {
          return node; // 匹配到的节点
        }
        if (node.children && node.children.length > 0) {
          const match = this.findMatchingNode(node.children, typeId);
          if (match !== null) {
            return match;
          }
        }
      }
      return null; // 如果没有找到匹配的节点，返回null
    },
    // 筛选节点
    filterNode(value, data) {
      if (!value) return true;
      return data.typeName.indexOf(value) !== -1;
    },
    // 节点单击事件
    handleNodeClick(data) {
      // console.log(data)
      this.title = data.typeName
      this.userName = data.userName
      if (data.loginId == data.userId) {
        this.isShowContent = true
      } else {
        this.isShowContent = false
      }
      // 状态 0：未编辑 1：编辑中 2：编辑完成 3：统稿中 4：统稿完成
      if (data.state == '3') {
        this.state = '统稿中'
      } else if (data.state == '4') {
        this.state = '统稿完成'
      } else {
        this.state = '未开始统稿'
      }
      // 统稿按钮
      if (data.state == '2' || data.state == '3') {
        this.isShowUnified = true
      } else {
        this.isShowUnified = false
      }
      // 编辑内容
      this.isShowEditor = false
      // 办结专题按钮
      if (data.state == '3') {
        this.isShowCompletion = true
        this.isShowEditor = true
      } else {
        this.isShowCompletion = false
      }
      // 编辑结果按钮
      if (data.state == '0') {
        this.isShowEditResults = false
      } else {
        this.isShowEditResults = true
        this.isShowEditor = true
      }
      // 统稿结果按钮
      if (data.state == '3' || data.state == '4') {
        this.isShowUnifiedDraftResults = true
        this.isShowEditor = true
      } else {
        this.isShowUnifiedDraftResults = false
      }

      if (data.parentId != '0' && data.typeId != '0') {
        this.isShow = true
      } else {
        this.isShow = false
      }
      this.detail.typeId = data.typeId
      this.typeId = data.typeId
      this.parentId = data.parentId
      this.info = undefined
      this.keyword = ''
      this.getMaterialDetail() // 获取编辑结果
    },

    // 获取编辑/统稿结果
    getMaterialDetail() {
      getDetail(this.typeId).then(response => {
        if (response.data != undefined) {
          this.info = response.data
          // 默认展示编辑结果
          this.keyword = this.info.content
        }
      })
    },
    // 点击编辑结果按钮
    handleEdit() {
      this.keyword = this.info.content
    },

    // 点击统稿结果按钮
    handleUnified() {
      this.keyword = this.info.manuscript
    },

    // 统稿按钮
    unified() {
      this.detail.open = true
      this.detail.title = '撰写目录名称为:' + this.title
      this.$nextTick(() => {   //此函数执行时所有的DOM挂载和渲染都已完成
        this.$refs.editThemeRef.init(this.info);     //获取子组件中init方法并将父组件数据传递给子组件
      });
    },

    // 办结专题
    completion() {
      this.form = {
        typeId: this.typeId,
        state: '4',
      }
      updateCode(this.form).then(response => {
        this.$modal.msgSuccess('办结专题成功')
        this.getDeptTree('item')
      })
    },
    editCancel() {
      this.detail.open = false
      this.getDeptTree('item')
    },

    // 转至成果管理
    handleClick() {
      console.log(this.parentId)
      if (this.parentId != 0) {
        this.$modal.msgWarning('请选择专题节点进行转至成果管理操作')
      } else {
        if (this.isFbState) {
          this.open = true
        } else {
          transferCode({
            ids:this.typeId,
          }).then(response => {
            this.$modal.msgSuccess('转至成果管理成功')
            this.open = false
          })
        }

      }
    },

    
    okTap() {
      transferCode({
        ids:this.typeId,
        mj:this.fileMj
      }).then(response => {
        this.$modal.msgSuccess('转至成果管理成功')
        this.open = false
      })
    }
  }
}
</script>

<style scoped></style>
